<template>
  <div>
    <!-- 修饰符作用： 增强原本事件的功能 -->
    <!-- 语法： @事件名.修饰符="..."  -->

    <!-- .prevent 阻止默认行为 -->
    <a @click.prevent="fn" href="https://www.baidu.com">点我1</a>

    <div @click="fatherFn">
      <!--  .stop 阻止事件冒泡 -->
      <button @click.stop="childFn">儿子</button>
    </div>
    <hr />
  </div>
</template>

<script>
export default {
  methods: {
    fn() {},
    childFn() {
      console.log("孩子被触发了  ----->  ");
    },
    fatherFn() {
      console.log("爸爸被触发了  ----->  ");
    },
  },
};
</script>

<style>
</style>